<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<title>sss</title>
<style>
.menu {
	margin: 0;
	padding: 0;
	list-style: none;
	left: 0;
	display: none;
	position: absolute;
	border: solid 1px #aaa;
	border-bottom: none;
}

.menu .item {
	height: 35px;
	line-height: 35px;
	background: #222;
	white-space: nowrap;
	float: left;
	clear: both;
	min-width: 100px;
	background: #fff;
	border-bottom: solid 1px #ccc;
	cursor: pointer;
}

.item a {
	color: #888;
	display: block;
	padding: 0 15px;
	text-decoration: none;
}

.item a:hover {
	color: #555;
	background-color: #ccc;
}

.item:hover {
	position: relative;
}

.item:hover>.menu {
	top:-1px;
	left: 100%;
	display: block;
}
</style>
</head>
<body>

	
	<div id="eee" style="width:300px;height:300px;background:#ccc;border:solid 1px #bbb;">
	
	
	
	</div>
	<ul id="s" class="menu">
		<li class="item"><a>sss</a></li>
		<li class="item"><a>sss</a></li>
		<li class="item"><a>sss</a></li>
		<li class="item"><a>sss</a></li>
		<li class="item"><a>sss</a></li>
		<li class="item"><a>asdf</a>
			<ul class="menu">
				<li class="item"><a>sss</a></li>
				<li class="item"><a>asdf</a>
					<ul class="menu">
						<li class="item"><a>sss</a></li>
						<li class="item"><a>sss</a></li>
						<li class="item"><a>sss</a></li>
						<li class="item"><a>sss</a></li>
						<li class="item"><a>sss</a></li>
					</ul></li>
				<li class="item"><a>sss</a></li>
				<li class="item"><a>sss</a></li>
				<li class="item"><a>asdf</a>
					<ul class="menu">
						<li class="item"><a>sss</a></li>
						<li class="item"><a>sss</a></li>
						<li class="item"><a>sss</a></li>
						<li class="item"><a>sss</a></li>
						<li class="item"><a>sss</a></li>
					</ul></li>
				<li class="item"><a>sss</a></li>
				<li class="item"><a>sss</a></li>
			</ul></li>
	</ul>
</body>
<script type="text/javascript">
	document.getElementById('eee').oncontextmenu = function(e) {
		var event = e||event;
		event.preventDefault();
		document.onselectstart = function(){return false;};
		
		var s = document.getElementById('s');
		s.style.left = event.pageX + 5 + 'px';
		s.style.top = event.pageY + 'px';
		s.style.display = 'block';
		document.onclick = function()  {
			s.style.display='none';
		};
	};
</script>
</html>